//显示学生成绩
<template>
  <div class="table">
    <p class="title">我的消息</p>
    <section class="content-el">
      <el-table ref="filterTable" :data="pagination.records" v-loading="loading">
        <el-table-column
          prop="messageContent"
          label="消息内容"
          column-key="answerDate"
          sortable
          show-overflow-tooltip
          >
        </el-table-column>
        <el-table-column
          prop="messageDate"
          label="消息时间"
          column-key="answerDate"
          sortable>
        </el-table-column>
        <el-table-column
          prop="course.courseName"
          label="课程名称"
          filter-placement="bottom-end">
        </el-table-column>
        <el-table-column fixed="right" label="操作">
          <template slot-scope="scope">
            <el-button type="primary" size="small" @click="openMessage(scope.row.messageContent)">详细内容</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-row type="flex" justify="center" align="middle" class="pagination">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="pagination.current"
          :page-sizes="[4,6,8,10]"
          :page-size="pagination.size"
          layout="total, sizes, prev, pager, next, jumper"
          :total="pagination.total">
        </el-pagination>
      </el-row>
    </section>
    <el-dialog
      title="全部信息"
      :visible.sync="dialogVisible"
      width="25%"
      :before-close="handleClose">
      <section>
        <el-input type="textarea" v-model="detialmes" :rows="5" disabled></el-input>
      </section>
    </el-dialog>
  </div>



</template>

<script>
export default {
  data() {
    return {
      pagination: { //分页后的留言列表
        current: 1, //当前页
        total: null, //记录条数
        size: 10 //每页条数
      },
      loading: false, //加载标识符
      score: [], //学生成绩
      filter: null, //过滤参数
      dialogVisible: false,
      detialmes: ''

    }
  },
  created() {
    this.getScore()
  },
  methods: {
    getScore() {
      let studentId = this.$cookies.get("cid")
      this.$axios(`/api/getusermes/${studentId}`,{
        params:{
          page:this.pagination.current,
          size:this.pagination.size
        }
      }).then(res => {
        console.log(res.data)
        this.pagination = res.data
      })
    },
    //改变当前记录条数
    handleSizeChange(val) {
      this.pagination.size = val
      this.getScore()
    },
    //改变当前页码，重新发送请求
    handleCurrentChange(val) {
      this.pagination.current = val
      this.getScore()
    },
    formatter(row, column) {
      return row.address;
    },
    filterTag(value, row) {
      return row.tag === value;
    },
    filterHandler(value, row, column) {
      const property = column["property"];
      return row[property] === value;
    },
    openMessage(mes){
      this.dialogVisible = true,
      this.detialmes = mes
    }
  }
};
</script>

<style lang="scss" scoped>
.pagination {
  padding-top: 20px;
}
.table {
  width: 980px;
  margin: 0 auto;
  .title {
    margin: 20px;
  }
  .content-el {
    background-color: #fff;
    padding: 20px;
  }
}

#searchdiv{
  width: 250px;
  display: inline-block;
  margin-left: 70%;
  margin-bottom: 5px;
}
</style>
